<template>
  <div class="item" v-if='detail'>
    <img :src="detail.img" alt="">
    <div>
      <p>豆瓣评分：{{detail.score}}</p>
      <p>产地：{{detail.country}}</p>
      <p><span class="tag" v-for='(tag, index) in detail.tags.split(",")' :key='index'>{{tag}}</span></p>
      <p>{{detail.summary}}</p>
    </div>

  </div>
</template>
<script>
import { mapActions, mapState } from 'vuex'

export default {
  computed: {

    ...mapState('detail', ['detail'])
  },
  methods: {
    ...mapActions('detail', ['queryMovieDetail'])
  },
  created () {
    // 触发action
    // /detail?id=123
    // 获取上述参数 this.$route.query.id
    // this.queryMovieDetail(this.$route.query.id)
    this.$store.dispatch('detail/queryMovieDetail', this.$route.query.id)
  }
}
</script>
